<template>
    <div class="workshop-index-box">
        <commpVxeTable
            :key="refreshTable"
            ref="headmanVxeTable"
            :config="{
                api:assessCheckApi.spcyQyInfoquerySccjPageList,
                rowId: 'id',
                paramet:{
                    fqyid:formState.id
                }
            }" 
            :isCanWrap="true"
            :columns="directoryColumnsVxe" 
            :formItem="directoryFormItem"
            :occupancyHeight="190"
        > 
            <template v-slot:externalOperations="{data}" v-if="!formState.isDisabled">
                <vxe-form-item>
                    <template>
                        <a-button class="blue-btn" type="primary" @click="addClick(0)">新增</a-button>
                    </template>
                </vxe-form-item>
            </template>
            <template v-slot:sfgq_name="{row}">
                <span v-if="row.sfgq == '长期有效'" style="color: #91cc75;">长期有效</span>
                <span v-if="row.sfgq == '未过期'" style="color: #5470c6;">未过期</span>
                <span v-if="row.sfgq == '即将过期'" style="color: #fac858;">即将过期</span>
                <span v-if="row.sfgq == '已过期'" style="color: #ee6666;">已过期</span>
            </template>
            <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                <a-form layout="inline" class="search-form" >
                    <a-form-item>
                        <a-button class="blue-btn" type="primary" @click="usageRecordsClick(row,0)" >车间使用记录</a-button>
                    </a-form-item>
                    <a-form-item v-if="!formState.isDisabled">
                        <a-button class="blue-btn" type="primary" @click="editClick(row,0)" >编辑</a-button>
                    </a-form-item>
                    <a-form-item v-else>
                        <a-button class="blue-btn" type="primary" @click="editClick(row,0,'查看')" >查看</a-button>
                    </a-form-item>
                    <a-form-item v-if="!formState.isDisabled">
                        <a-button class="red-btn" type="primary" @click="deleteClick(row,0)" >删除</a-button>
                    </a-form-item>
                </a-form> 
            </template>
        </commpVxeTable>
        <workshopAddEdit ref="workshopAddEditRef0" @addItem="addItem" @editItem="editItem"/>
        <usageRecords ref="usageRecordsRef"/>
    </div>
</template>
<script>
import assessCheckApi from '../service/api'
import commpVxeTable from '@/components/commp-vxe-table/commp-vxe-table.vue'
import workshopAddEdit from './workshopAddEdit.vue'
import usageRecords from './usageRecords.vue'
import {
    spcyQyInfoupdateSccj,
    spcyQyInfoaddSccj,
    spcyQyInfodeleteSccj,
    
} from '../service/index'
export default {
    components:{
        commpVxeTable,
        workshopAddEdit,
        usageRecords,
    },
    props:{

    },
    data(){
        return{
            assessCheckApi:assessCheckApi,
            formState:{},
            refreshTable:null,
            directoryFormItem:[{
                label: '车间编号',
                model: 'fcjbh',
            },{
                label: '车间名称',
                model: 'fcjmc',
            }],
            directoryColumnsVxe:[{ 
                type: 'checkbox', 
                width: 60 ,
                fixed: 'left'
            },{
                title: '车间编号',
                field: 'fcjbh',
            },{
                title: '车间名称',
                field: 'fcjmc',
            },{
                title: '负责人',
                field: 'ffzr',
            },{
                title: '区域分类',
                field: 'fqyfl',
            },{
                title: '投用时间',
                field: 'ftysj',
            },{
                title: '操作',
                field: 'id',
                slots: {
                    // 使用插槽模板渲染
                    default: 'operation_btn',
                },
                width:320,
                fixed:'right'
            }],
            methodList:[{
                name:'生产车间',
                editName:spcyQyInfoupdateSccj,
                deleteName:spcyQyInfodeleteSccj,
                addName:spcyQyInfoaddSccj,
            }]
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        getData(row){
            this.formState = row
            this.refreshTable = Date.now()
        },
        usageRecordsClick(val){
            this.$refs.usageRecordsRef.getData({fqyid:this.formState.id,...val,})
            this.$refs.usageRecordsRef.visible = true
        },
        addClick(index){
            let refName = 'workshopAddEditRef'+index
            this.$refs[refName].getData({fqyid:this.formState.id,index:index})
            this.$refs[refName].visible = true
        },
        editClick(val,index,view){
            //console.log(val)
            let refName = 'workshopAddEditRef'+index
            this.$refs[refName].getData({fqyid:this.formState.id,...val,index:index,view:view?true:false})
            this.$refs[refName].visible = true
        },
        addItem(val,vis,isTip){
            //console.log('新增',val)
            let refName = 'workshopAddEditRef'+val.index
            this.methodList[val.index].addName(val).then(res=>{
                if(res.code == 200){
                    this.refreshTable = Date.now()
                    if(!isTip){
                        this.$message.success(res.message)
                    }
                    
                    this.$refs[refName].getData({fqyid:this.formState.id,...res.result,index:val.index})
                    this.$refs[refName].visible = vis
                    //console.log(res)
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        editItem(val,vis){
            //console.log('编辑',val)
            let refName = 'workshopAddEditRef'+val.index
            this.methodList[val.index].editName(val).then(res=>{
                if(res.code == 200){
                    this.refreshTable = Date.now()
                    this.$message.success(res.message)
                    this.$refs[refName].visible = vis
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        deleteClick(val,index){
            var that = this
            this.$confirm({
                title:'您确认要删除吗？',
                // icon: createVNode(ExclamationCircleOutlined),
                onOk() {
                    that.methodList[index].deleteName({ids:val.id}).then(res=>{
                        if(res.code == 200){
                            that.$message.success('删除成功')
                            that.refreshTable = Date.now()
                        }else{
                            that.$message.warning(res.message)
                        }
                    })
                },
                
            });
        },
    }
}
</script>